Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

182
Visualizações
Problem when trying to add an element to a page using appendChild in JS. Throws an error: "is null, undefined"

I am trying to authorize the site through Firebase, everything works as it should, the data is sent to the Firebase server. But further, in the signIn function, I try to create a h2-element and put the mail data into it, which the user entered and clicked on the Login button (I want the mail to be displayed on the site instead of the name), then an error appears on the line where I highlighted with a red arrow: "autorizationName is null, undefined ", no data is sent to html. I can’t understand why, so help, please, I’m recently studying JS to figure it out.

This can happen if I added one JS script to two HTML pages? That is, index.html and autorization.html to the two I added autorization.js I wanted it to be redirected to the main page when authorizing from one page.

  const login = document.querySelector(".form-login")
  login.addEventListener('click', signIn)

function signIn() {
  const email = document.querySelector(".email").value
  const password = document.querySelector(".password").value
//   e.preventDefault()

  signInWithEmailAndPassword(auth, email, password)
      .then((userCredential) => {
          // Signed in 
          const user = userCredential.user;                        
          console.log("Email firebase: ",  user.email);           

          const user2 = JSON.parse(JSON.stringify(user.email))

          const autorizationName = document.querySelector(".autorization-name__container");
          const autorizationNameTitle = document.createElement("h2");
          autorizationNameTitle.textContent = user2;
          autorizationNameTitle.classList.add("autorization-name__title");
          

          autorizationName.appendChild(autorizationNameTitle); // Error: autorizationName is null, undefined
          window.location.replace("http://192.168.1.65:5500/")  
                 
      })

      .catch((error) => {
          const errorCode = error.code;
          const errorMessage = error.message;
          alert(errorMessage + ", " + errorCode);
      });
  }

Here are screenshots:

enter image description hereenter image description here

about 4 years ago · Juan Pablo Isaza
2 Respostas
Responde à pergunta

0

At the line of

autorizationName.appendChild(autorizationNameTitle);

you are getting an error which says that authorizationName is null, undefined. So, logically, we need to take a look at the place where its value was modified the last time (in this case, it is its initialization):

const autorizationName = document.querySelector(".autorization-name__container");

And it is a known fact that if your call to document.querySelector yields undefined, then the selector did not match any elements. So, the reason for the error is that there is no element in your page with the class of authorization-name__container at the time you try to find it. So, you will need to fix the selector or find out when the given element is created.

about 4 years ago · Juan Pablo Isaza Relatório

0

It is 100% an error with the string '.authorization-name__container', try to copy paste this class from where you have it in your code and double check for mispelled words. Then if that doesn't work try to use an id instead of a class

about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda